// 多基金指令新增页
import React from 'react';
import { FirstHeaderC } from '../../../comps';
import { Menu } from 'antd';
import style from './style.less';
import AddBond from '../../InvestmentManage/BondTradeNew/orderComps/addBond.js';
import AddFinaFlocking from '../../InvestmentManage/finaFlockingNew/orderComps/addFinaFlocking';
import AddNonstandardOrder from '../../InvestmentManage/nonstandardOrder/orderComps/addNonstandardOrder';
import BuyBackOrder from '../../InvestmentManage/BuybackOrder/buyBackOrder';
import { memu } from '../../../utils/enumeratedValues/moreFundsOrder';
const MenuItem = Menu.Item;
class AddNewC extends React.Component {
  state = {
    selMenuItem: '1', // 默认选中第一条
  };

  componentDidMount() {}

  // “保存”
  onOk = (e) => {
    this.props.refresh(e);
  };
  // “取消”
  onCancel = () => {
    this.props.onClose();
  };

  showTable = () => {
    const { selMenuItem } = this.state;
    switch (selMenuItem) {
      // 债券指令
      case '1':
        return <AddBond type={12} onOk={() => this.onOk('0')} onCancel={this.onCancel} />;
      // 回购指令
      case '2':
        return <BuyBackOrder type={12} onOk={() => this.onOk('4')} onCancel={this.onCancel} />;
      // 理财直融
      case '3':
        return <AddFinaFlocking type={12} onOk={() => this.onOk('7')} onCancel={this.onCancel} />;
      // 非标指令
      case '4':
        return <AddNonstandardOrder type={12} onOk={() => this.onOk('12')} onCancel={this.onCancel} />;
    }
  };

  render() {
    let { selMenuItem } = this.state;
    const { type } = this.props;
    return (
      <div>
        <FirstHeaderC title={'多基金簿记新增'} />
        <div className={style.bookkeepingMnt}>
          {/* 左侧导航 */}
          <div className={style.left} style={{ height: 'calc(100vh - 170px)' }}>
            <Menu mode='inline' defaultSelectedKeys={[selMenuItem]} onClick={(val) => this.setState({ selMenuItem: val.key })}>
              {memu &&
                memu.map((item) => (
                  <MenuItem key={item.code} value={item.code}>
                    {item.value}
                  </MenuItem>
                ))}
            </Menu>
          </div>
          {/* 右侧内容区 */}
          <div className={style.right} style={{ width: 'calc(100% - 200px)', maxHeight: 'calc(100vh - 170px)' }}>
            <div className={style.rightTop}>
              {/* 根据导航，展示内容 */}
              {this.showTable()}
            </div>
          </div>
        </div>
      </div>
    );
  }
}

export default AddNewC;
